<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core"
	xmlns:a4j="http://richfaces.org/a4j" xmlns:p="http://primefaces.org/ui"
	xmlns:t="http://myfaces.apache.org/tomahawk" template="/pages/template/main-layout.xhtml">
	<ui:define name="head">
		<script type="text/javascript">  
		function handleSubmitEvent(xhr, status, args) {  
			if(args.validationFailed || args.therapyError) {  
				//jQuery('#docScheduleDialog').effect("shake", { times:3 }, 100);  
			} else {  
				docScheduleDlg.hide();
			 }  
		}
		</script>
	</ui:define>

	<ui:define name="content">

		<h:panelGrid width="100%" cellpadding="5">
			<h:panelGrid id="qyInfo">
				<h:panelGrid columns="3">
					<h:outputLabel value="#{msgs.dept_title}" />
					<p:selectOneMenu value="#{doctorScheduleQueryBean.deptId}" styleClass="gridNoBorder"
						converter="longConverter">
						<f:selectItem  itemLabel="" itemValue=""/>
						<f:selectItems value="#{doctorScheduleQueryBean.departments}" var="doc"
							itemLabel="#{doc.deptName}" itemValue="#{doc.id}" />
						<p:ajax listener="#{doctorScheduleQueryBean.selectDepartment}" update="pnlEmp, doctorSchedule"/>	
					</p:selectOneMenu>
				</h:panelGrid>

				<h:panelGrid columns="3" id="pnlEmp">
					<h:outputLabel value="#{msgs.evok_doctor_title}" />
					<p:selectManyCheckbox value="#{doctorScheduleQueryBean.selectedDoctorId}"
						styleClass="gridNoBorder" converter="longConverter">
						<f:selectItems value="#{doctorScheduleQueryBean.doctorList}" var="doc"
							itemLabel="#{doc.userReference.surname} #{doc.userReference.name}" itemValue="#{doc.id}" />
					</p:selectManyCheckbox>
					<h:panelGrid columns="2">
						<p:commandButton value="#{msgs.button_query}" icon="ui-icon-search"
							actionListener="#{doctorScheduleQueryBean.queryAction}" update="doctorSchedule" />

						<p:commandButton value="#{msgs.button_reset}" icon="ui-icon-arrowrefresh-1-n"
							update="doctorSchedule, qyInfo" action="#{doctorScheduleQueryBean.resetAction}" />
					</h:panelGrid>
				</h:panelGrid>
			</h:panelGrid>

			<p:schedule id="doctorSchedule" value="#{doctorScheduleQueryBean.lazyEventModel}" locale="hr"
				timeZone="EST" widgetVar="myschedule" resizable="false" draggable="false">
				<p:ajax event="dateSelect" listener="#{doctorScheduleQueryBean.onDateSelect}"
					update=":dialogform:userEventDetails" oncomplete="docScheduleDlg.show()" />

				<p:ajax event="eventSelect" listener="#{doctorScheduleQueryBean.onEventSelect}"
					update=":dialogform:userEventDetails" oncomplete="docScheduleDlg.show()" />
			</p:schedule>


		</h:panelGrid>
	</ui:define>
	<ui:define name="dialog">

		<p:dialog widgetVar="docScheduleDlg" header="#{msgs.patient_reservations}" showEffect="clip"
			hideEffect="clip" closable="true" modal="true" width="800" height="550" id="docScheduleDialog">
			<h:panelGrid id="userEventDetails" width="100%">
				<h:panelGrid columns="4" cellpadding="3" style="width:100%"
					columnClasses="width20,width30,width20,width30">
					<h:outputLabel value="#{msgs.patient_therapy_type}" />
					<h:outputLabel value="#{doctorScheduleQueryBean.calendarType}" converter="enumConverter"
						enumName="CalendarType" />

					<h:outputLabel value="#{msgs.evok_doctor_title}" />
					<p:selectOneMenu value="#{doctorScheduleQueryBean.doctorId}" converter="longConverter">
						<f:selectItem itemLabel="" itemValue="" />
						<f:selectItems value="#{doctorScheduleQueryBean.doctorList}" var="doc"
							itemLabel="#{doc.userReference.surname} #{doc.userReference.name}" itemValue="#{doc.id}" />
					</p:selectOneMenu>
				</h:panelGrid>

				<p:panel visible="#{doctorScheduleQueryBean.calendarType == 1}" id="pnlPatient">
					<h:panelGrid columns="2" width="100%" cellpadding="3" columnClasses="width20,width80">
						<h:outputLabel value="#{msgs.default_name_surname}" />
						<h:panelGroup>
							<p:autoComplete completeMethod="#{doctorScheduleQueryBean.completeQueryName}"
								id="patientname" size="40" value="#{doctorScheduleQueryBean.qyPatientName}"
								forceSelection="true" minQueryLength="3">
								<p:ajax event="itemSelect" listener="#{doctorScheduleQueryBean.selectPatientName}" />
							</p:autoComplete>
							<p:commandButton value="#{msgs.patient_therapy_add_into}" onsuccess="therapyDlg.show();"
								immediate="true" icon="ui-icon-plus" autoSubmit="false"
								actionListener="#{doctorScheduleQueryBean.openTherapyListAction}"
								update=":dialogform:therapyList" />
						</h:panelGroup>
						<h:outputLabel value="#{msgs.default_priority}" />
						<p:selectBooleanCheckbox value="#{doctorScheduleQueryBean.doctorSchedule.priority}" />

						<h:outputLabel value="#{msgs.default_status}" />
						<p:selectOneMenu value="#{doctorScheduleQueryBean.doctorSchedule.status}">
							<f:selectItems value="#{sessionEnum['ReservationStatus']}" var="en" itemLabel="#{en.name}"
								itemValue="#{en.value}" />
						</p:selectOneMenu>
					</h:panelGrid>
					<p:panel visible="#{doctorScheduleQueryBean.therapyObj != null}"
						header="#{msgs.patient_therapy_title}" id="pnlTherapy">
						<p:panelGrid columns="2" width="100%" cellpadding="5" columnClasses="width20,width80">
							<h:outputLabel value="#{msgs.patient_therapy_startDate}" />
							<h:outputText value="#{doctorScheduleQueryBean.therapyObj[0]}" converter="dateConverter" />

							<h:outputLabel value="#{msgs.therapy_category}" />
							<h:outputText value="#{doctorScheduleQueryBean.therapyObj[1]}" />

							<h:outputLabel value="#{msgs.default_status}" />
							<h:outputText value="#{doctorScheduleQueryBean.therapyObj[2]}" converter="enumConverter"
								enumName="TherapyStatus" />
						</p:panelGrid>
						<f:facet name="footer">
							<p:commandButton value="#{msgs.button_remove}" icon="ui-icon-close"
								actionListener="#{doctorScheduleQueryBean.deleteTherapyAction}" update="pnlTherapy" />
						</f:facet>
					</p:panel>

					<h:panelGrid columns="2" style="width:100%" cellpadding="5" columnClasses="width20,width80">
						<h:outputLabel value="#{msgs.default_remark}" />
						<p:inputTextarea value="#{doctorScheduleQueryBean.doctorSchedule.content}" style="width:100%"
							rows="5" autoResize="false" />

						<h:outputLabel value="#{msgs.default_from}" />
						<p:calendar value="#{doctorScheduleQueryBean.doctorSchedule.timeFrom}"
							timeZone="Europe/Zagreb" pattern="dd/MM/yyyy HH:mm" showOn="button" />

						<h:outputLabel value="#{msgs.default_to}" />
						<p:calendar value="#{doctorScheduleQueryBean.doctorSchedule.timeTo}" timeZone="Europe/Zagreb"
							showOn="button" pattern="dd/MM/yyyy HH:mm" />
					</h:panelGrid>
				</p:panel>

				<p:panel visible="#{doctorScheduleQueryBean.calendarType == 2}">
					<h:panelGrid columns="2" style="width:100%" cellpadding="5" columnClasses="width20,width80">
						<h:outputLabel for="title" value="#{msgs.default_remark}" />
						<p:inputTextarea id="title" value="#{doctorScheduleQueryBean.uEvent.title}" style="width:100%"
							rows="5" autoResize="false" />

						<h:outputLabel value="#{msgs.default_from}" />
						<p:calendar value="#{doctorScheduleQueryBean.uEvent.timeFrom}" timeZone="Europe/Zagreb"
							pattern="dd/MM/yyyy HH:mm" showOn="button" />

						<h:outputLabel value="#{msgs.default_to}" />
						<p:calendar value="#{doctorScheduleQueryBean.uEvent.timeTo}" timeZone="Europe/Zagreb"
							showOn="button" pattern="dd/MM/yyyy HH:mm" />
					</h:panelGrid>
				</p:panel>

				<f:facet name="footer">
					<h:panelGrid columns="2" width="100%" columnClasses="left,right">
						<p:commandButton value="#{msgs.button_delete}"
							rendered="#{doctorScheduleQueryBean.doctorSchedule.id != null and doctorScheduleQueryBean.doctorSchedule.oper.id eq sessionUserBean.id}"
							icon="ui-icon-trash" onclick="confirmDeleteSchedule.show();" style="float:left" />

						<h:panelGroup style="float:right">
							<p:commandButton value="#{msgs.button_submit}"
								rendered="#{doctorScheduleQueryBean.calendarType == 1}"
								actionListener="#{doctorScheduleQueryBean.submitEventAction}" icon="ui-icon-disk"
								oncomplete="handleSubmitEvent(xhr, status, args);myschedule.update();" update=":messages" />
						</h:panelGroup>
					</h:panelGrid>
				</f:facet>
			</h:panelGrid>
		</p:dialog>

		<p:dialog widgetVar="therapyDlg" header="#{msgs.patient_therapy_title}" showEffect="clip"
			hideEffect="clip" closable="true" modal="true" width="800" height="400">
			<p:dataTable id="therapyList" value="#{doctorScheduleQueryBean.therapyModel}" var="te">
				<p:column headerText="#{msgs.patient_therapy_startDate}">
					<h:outputText value="#{te[0]}" converter="dateConverter" />
				</p:column>
				<p:column headerText="#{msgs.therapy_category}">
					<h:outputText value="#{te[1]}" />
				</p:column>
				<p:column headerText="#{msgs.default_status}">
					<h:outputText value="#{te[3]}" converter="enumConverter" enumName="TherapyStatus" />
				</p:column>
				<p:column headerText="#{msgs.patient_therapy_choose}">
					<p:commandLink actionListener="#{doctorScheduleQueryBean.chooseTherapyAction}"
						styleClass="ui-icon ui-icon-flag" title="#{msgs.patient_therapy_choose_lowcase}"
						update=":dialogform:pnlTherapy" onsuccess="therapyDlg.hide();">
					</p:commandLink>
				</p:column>
			</p:dataTable>
		</p:dialog>

		<p:confirmDialog message="#{msgs.info_sure_delete}" width="200" showEffect="explode"
			hideEffect="explode" header="#{msgs.default_alert}" severity="alert"
			widgetVar="confirmDeleteSchedule" modal="true">

			<p:commandButton value="#{msgs.button_and}" immediate="true" update=":messages"
				actionListener="#{doctorScheduleQueryBean.deleteEvent}"
				oncomplete="confirmDeleteSchedule.hide();myschedule.update();docScheduleDlg.hide();" />

			<p:commandButton value="#{msgs.button_not}" onclick="confirmDeleteSchedule.hide()" type="button" />
		</p:confirmDialog>
	</ui:define>
</ui:composition>
